import React from 'react';
import { BrowserRouter as Router, Routes, Route, Navigate } from 'react-router-dom';
import { ConfigProvider } from 'antd';
import zhCN from 'antd/es/locale/zh_CN';
import './App.css';

import { AuthProvider } from './contexts/AuthContext';
import Layout from './components/Layout/Layout';
import Login from './pages/Login/Login';
import Register from './pages/Register/Register';
import Dashboard from './pages/Dashboard/Dashboard';
import CourseList from './pages/Course/CourseList';
import CourseDetail from './pages/Course/CourseDetail';
import BookingList from './pages/Booking/BookingList';
import StudentList from './pages/Student/StudentList';
import StudentDetail from './pages/Student/StudentDetail';
import StudentEdit from './pages/Student/StudentEdit';
import TeacherList from './pages/Teacher/TeacherList';
import TeacherDetail from './pages/Teacher/TeacherDetail';
import TeacherEdit from './pages/Teacher/TeacherEdit';
import BookingDetail from './pages/Booking/BookingDetail';
import Profile from './pages/Profile/Profile';
import ProtectedRoute from './components/ProtectedRoute/ProtectedRoute';

function App() {
  return (
    <ConfigProvider locale={zhCN}>
      <AuthProvider>
        <Router>
          <div className="App">
            <Routes>
              <Route path="/login" element={<Login />} />
              <Route path="/register" element={<Register />} />
              <Route path="/" element={
                <ProtectedRoute>
                  <Layout />
                </ProtectedRoute>
              }>
                <Route index element={<Navigate to="/dashboard" replace />} />
                <Route path="dashboard" element={<Dashboard />} />
                <Route path="courses" element={<CourseList />} />
                <Route path="courses/:id" element={<CourseDetail />} />
                <Route path="bookings" element={<BookingList />} />
                <Route path="bookings/:id" element={<BookingDetail />} />
                <Route path="students" element={
                  <ProtectedRoute requiredRole="ADMIN">
                    <StudentList />
                  </ProtectedRoute>
                } />
                <Route path="students/:id" element={
                  <ProtectedRoute requiredRole="ADMIN">
                    <StudentDetail />
                  </ProtectedRoute>
                } />
                <Route path="students/new" element={
                  <ProtectedRoute requiredRole="ADMIN">
                    <StudentEdit />
                  </ProtectedRoute>
                } />
                <Route path="students/:id/edit" element={
                  <ProtectedRoute requiredRole="ADMIN">
                    <StudentEdit />
                  </ProtectedRoute>
                } />
                <Route path="teachers" element={
                  <ProtectedRoute requiredRole="ADMIN">
                    <TeacherList />
                  </ProtectedRoute>
                } />
                <Route path="teachers/:id" element={
                  <ProtectedRoute requiredRole="ADMIN">
                    <TeacherDetail />
                  </ProtectedRoute>
                } />
                <Route path="teachers/new" element={
                  <ProtectedRoute requiredRole="ADMIN">
                    <TeacherEdit />
                  </ProtectedRoute>
                } />
                <Route path="teachers/:id/edit" element={
                  <ProtectedRoute requiredRole="ADMIN">
                    <TeacherEdit />
                  </ProtectedRoute>
                } />
                <Route path="profile" element={<Profile />} />
              </Route>
              
              {/* 404 重定向 */}
              <Route path="*" element={<Navigate to="/dashboard" replace />} />
            </Routes>
          </div>
        </Router>
      </AuthProvider>
    </ConfigProvider>
  );
}

export default App;